/* pages/luxian/index.wxss */

.classification {
  padding: 20px 0;
  background-color: #fff;
  margin: 12rpx 0;

  .list {
    overflow: hidden;
    overflow-x: auto;
    white-space: nowrap;
    padding: 0 20rpx;

    view {
      display: inline-block;
      width: 240rpx;
      height: 110rpx;
      border-radius: 8rpx;
      overflow: hidden;
      position: relative;
      margin-left: 20rpx;

      &:first-child {
        margin: 0;
      }

      image {
        width: 100%;
        height: 100%;
      }

      text {
        color: #fff;
        width: 100%;
        text-align: center;
        line-height: 110rpx;
        position: absolute;
        left: 0;
        top: 0;
      }
    }
  }
}

.titlist {
  overflow: hidden;
  overflow-x: auto;
  white-space: nowrap;
  padding: 0 20rpx;

  view {
    display: inline-block;
    font-size: 28rpx;
    margin-right: 40rpx;

    &:last-child {
      margin: 0;
    }

    &.chk {
      font-weight: bold;
    }
  }
}

.recommend {
  padding: 40rpx 0;
  background-color: #fff;

  .list {
    overflow: hidden;
    overflow-x: auto;
    white-space: nowrap;
    padding: 24rpx 20rpx 0;

    .one {
      display: inline-block;
      width: 360rpx;
      height: 480rpx;
      position: relative;
      border-radius: 12rpx;
      overflow: hidden;
      margin-left: 20rpx;

      &:first-child {
        margin: 0;
      }

      image {
        width: 100%;
        height: 100%;
      }

      .type {
        padding: 12rpx;
        line-height: 1;
        color: #fff;
        font-size: 24rpx;
        background-color: rgba($color: #000000, $alpha: 0.3);
        border-radius: 12rpx 0 12rpx 0;
        position: absolute;
        top: 0;
        left: 0;
      }

      .bottom {
        color: #fff;
        position: absolute;
        left: 20rpx;
        right: 20rpx;
        bottom: 28rpx;

        .tit {
          width: 100%;
          font-size: 32rpx;
          font-weight: bold;
          white-space: nowrap;
          text-overflow: ellipsis;
          overflow: hidden;
          margin-bottom: 20rpx;
        }

        .under {
          display: flex;
          font-size: 24rpx;

          view {
            display: flex;
            align-items: center;

            image {
              margin-right: 10rpx;
            }
          }
        }
      }
    }

  }
}

.route {
  margin-top: 10rpx;
  padding: 40rpx 0;
  background-color: #fff;
}



.history {
  box-sizing: border-box;
  margin-top:10rpx;
  display: flex;
  flex-direction: column;

  .nav{
    display: flex;
    align-content: center;
    padding: 40rpx 20rpx 20rpx;

    view{
      font-size: 28rpx;
      margin-right: 40rpx;

      &.chk{
        font-weight: bold;
      }
    }
  }

  swiper{
    flex: 1;

    swiper-item{
      height: 100%;

      scroll-view{
        height: 100%;
      }
    }
  }

}